<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 3//EN">
<HTML><HEAD>
		<TITLE>QuickStart Guide - Controlling the Appearance of an Object: The Image Window</TITLE>
		<META HTTP-EQUIV="keywords" CONTENT="GRAPHICS VISUALIZATION VISUAL PROGRAM DATA
MINING">
	<meta http-equiv="content-type" content="text/html;charset=ISO-8859-1">
</HEAD><BODY BGCOLOR="#FFFFFF" link="#00004b" vlink="#4b004b">
		<TABLE width=510 border=0 cellpadding=0 cellspacing=0>
			<TR>
				<TD><IMG src="../images/spacer.gif" width=80 height=1></TD>
				<TD><IMG src="../images/spacer.gif" width=49 height=1></TD>
				<TD><IMG src="../images/spacer.gif" width=24 height=1></TD>
				<TD><IMG src="../images/spacer.gif" width=100 height=1></TD>
				<TD><IMG src="../images/spacer.gif" width=3 height=1></TD>
				<TD><IMG src="../images/spacer.gif" width=127 height=1></TD>
				<TD><IMG src="../images/spacer.gif" width=6 height=1></TD>
				<TD><IMG src="../images/spacer.gif" width=50 height=1></TD>
				<TD><IMG src="../images/spacer.gif" width=71 height=1></TD>
			</TR>
			<TR>
				<TD colspan=9><IMG src="../images/flcgh_01.gif" width=510 height=24 alt="OpenDX Documentation"></TD>
			</TR>
			<TR>
				<TD colspan=2><A href="../allguide.htm"><IMG src="../images/flcgh_02.gif" width=129 height=25 border="0" alt="Full Contents"></A></TD>
				<TD colspan=3><A href="../qikguide.htm"><B><IMG src="../images/flcgh_03d.gif" width=127 height=25 border="0" alt="QuickStart Guide"></B></A></TD>
				<TD><A href="../usrguide.htm"><IMG src="../images/flcgh_04.gif" width=127 height=25 border="0" alt="User's Guide"></A></TD>
				<TD colspan=3><A href="../refguide.htm"><IMG src="../images/flcgh_05.gif" width=127 height=25 border="0" alt="User's Reference"></A></TD>
			</TR>
			<TR>
				<TD><A href="qikgu014.htm"><IMG src="../images/flcgh_06.gif" width=80 height=17 border="0" alt="Previous Page"></A></TD>
				<TD colspan=2><A href="qikgu016.htm"><IMG src="../images/flcgh_07.gif" width=73 height=17 border="0" alt="Next Page"></A></TD>
				<TD><A href="../qikguide.htm"><IMG src="../images/flcgh_08.gif" width=100 height=17 border="0" alt="Table of Contents"></A></TD>
				<TD colspan=3><A href="qikgu011.htm"><IMG src="../images/flcgh_09.gif" width=136 height=17 border="0" alt="Partial Table of Contents"></A></TD>
				<TD><A href="qikgu035.htm"><IMG src="../images/flcgh_10.gif" width=50 height=17 border="0" alt="Index"></A></TD>
				<TD><A href="../srchindx.htm"><IMG src="../images/flcgh_11.gif" width=71 height=17 border="0" alt="Search"></A></TD>
			</TR>
		</TABLE>
		<H2>2.5 Controlling the Appearance of an Object: The Image Window</H2>
		<A NAME="IDX46"></A><A NAME="IDX47"></A>
<A NAME="IDX49"></A>
<P>
Controlling the appearance of an object means being able to control
various aspects of its visual image on the screen as well as the
data used in generating that image.
This section deals briefly with control of the following aspects:
<UL COMPACT>
<LI>the object&#39;s appearance (size and the "view" displayed in
the Image window)
<LI>the sequence in which object images are presented
<LI>the input from which an object&#39;s image is generated
<LI>the color(s) of an object
<LI>the placement of axes around an object.
</UL>
<P><B>Note: </B>Throughout this document, the term "Image window" refers to
the window generated by Image (not by Display).
Both of these modules are described in <I>IBM Visualization Data Explorer
User&#39;s Reference</I>.
Also see <I>IBM Visualization Data Explorer User&#39;s Guide</I> for a
comprehensive treatment of the user
interface.
<P>
<H3><A NAME="Header_24" ></A>Size, View, and AutoAxes
</H3>
<A NAME="IDX50"></A>
<A NAME="IDX51"></A>
<P>
In Data Explorer the most easily controlled feature of an object in the Image
window is its size, which can be changed by direct manipulation
of the window.
Other important features of its appearance are controlled through two
options in the <TT><STRONG>Options</STRONG></TT> pull-down menu in the Image
window menu bar: <TT><STRONG>View Control</STRONG></TT> and
<TT><STRONG>AutoAxes</STRONG></TT>.
<P>
<H4><U>Size Control</U></H4>
<A NAME="IDX52"></A>
<A NAME="IDX53"></A>
<P>
To change the size of an image, simply change the size of the Image
window.
Holding down the <I>left</I> mouse button:
<UL COMPACT>
<LI>Drag a horizontal border to shrink or expand the window
vertically.
<LI>Drag a vertical border to shrink or expand the window
horizontally.
<LI>Drag a corner to shrink or expand a window vertically <I>and</I>
horizontally.
</UL>
<P><B>Notes: </B><OL COMPACT>
<LI><TT><STRONG>Reset</STRONG></TT> in the <TT><STRONG>Options</STRONG></TT>
pull-down menu restores the original <I>view</I> of the
object but not the original size of the window.
<LI>If your visual program uses the Display rather than the Image tool,
the image size can be changed only by changing the resolution
parameter of Camera or AutoCamera (see <A
HREF="refgu021.htm#HDRCAMERA">Camera</A> and
<A HREF="refgu015.htm#HDRAUTOCAM">AutoCamera</A> in <I>IBM Visualization Data
Explorer User&#39;s Reference</I> for descriptions of these tools.)
</OL>
<P>
<H4><U>View Control</U></H4>
<A NAME="IDX54"></A>
<A NAME="IDX55"></A>
The <TT><STRONG>View Control</STRONG></TT> dialog box allows you to control
(among other aspects of an object) the following:
<UL COMPACT>
<LI>Viewing direction
<LI>Rotation
<LI>Field of view (zooming and panning).
</UL>
<P>
To open this dialog box, select <TT><STRONG>View Control...</STRONG></TT>
in the <TT><STRONG>Options</STRONG></TT> pull-down menu in the
Image window.
<P>
<H5><U>Controlling the Viewing Direction</U></H5>
<A NAME="IDX56"></A>
<A NAME="IDX57"></A>
<P>
To change the viewing direction, select <TT><STRONG>Set View</STRONG></TT>
in the dialog box (see <A HREF="#FIGVCBOX">Figure 6</A>).
The list of choices that appears includes 7 directional views of the
object (Top, Bottom, etc.).
Because these "head on" views show only "one side" of an
object (tending to flatten its appearance), the list also
offers 7 corresponding "off" views (Off Top, Off
Bottom, etc.).
<P><B><A NAME="FIGVCBOX" HREF="../qikguide.htm#FT_FIGVCBOX">Figure 6. View Control
Dialog Box</A></B>. This dialog box is activated from the Options pull-down menu
of the Image window (see <A HREF="qikgu014.htm#FIGIMWIN">Figure 5</A>).<BR>
<B><BR><CENTER><IMG SRC="../images/vuctrl.gif" ALT="Figure vuctrl not
displayed."></CENTER><BR></B><BR>
<A NAME="IDX59"></A>
<P>

When you select a view of an object, the image is automatically
altered (note the highlighted <TT><STRONG>Execute</STRONG></TT> in the
menu bar).
<P>
<H5><U>Controlling Rotation</U></H5>
<A NAME="IDX60"></A>
<A NAME="IDX61"></A>
<P>
To rotate an object in the Image window, first click on the
<TT><STRONG>Mode</STRONG></TT> option box (initially displaying
<TT><STRONG>None</STRONG></TT>) and then select
<TT><STRONG>Rotate</STRONG></TT> from the
displayed list.
<TT><STRONG>Rotate</STRONG></TT> becomes the current mode and a set of axes
appears in the lower right-hand corner of the window.
You can rotate the object in two dimensions (clockwise and
counterclockwise) or in three by rotating the
axes.
You can also cause the object to rotate "continuously" (i.e.,
in coordination with the axes).
<TABLE CELLPADDING="3">
<TR VALIGN="TOP"><TD><P><B>2-D Rotation
</B></TD><TD><P>Position the mouse cursor in the Image window and hold down the
<I>right</I> mouse button:
clockwise movement of the mouse produces clockwise rotation of the
<I>axes</I>; counterclockwise movement produces
counterclockwise rotation.
When the mouse button is released, the <I>object</I> rotates by the
same amount as the axes have, assuming the same relative position
in the window.
</TD></TR><TR VALIGN="TOP"><TD><P><B>3-D Rotation
</B></TD><TD><P>Position the mouse cursor in the Image window and hold down the
<I>left</I> mouse button: the mouse now behaves like a
track ball and the axes move accordingly.
When the mouse button is released, the object rotates by the same
amount as the axes have, assuming the same relative position
in the window.
</TD></TR><TR VALIGN="TOP"><TD><P><B>Continuous Rotation
</B></TD><TD><P>Once you have selected <TT><STRONG>Rotate</STRONG></TT> mode,
you can
make the object rotate along with the axes:
select <TT><STRONG>Execute</STRONG></TT> in the menu bar and then
<TT><STRONG>Execute on
Change</STRONG></TT> in the pull-down menu (<TT><STRONG>Execute</STRONG></TT> is
highlighted).
The image is now replaced by a dot representation of the object (see
rendering options in <I>IBM Visualization Data Explorer User&#39;s Guide</I>).
The movement of the mouse (and the axes) is reflected directly and
continuously in the movement of this dot version.
<P><B>Note: </B>Movement of the axes is essentially synchronous with movement of
the mouse, but the "response time" of the dot version may vary,
depending on the machine and configuration.
</TD></TR></TABLE>
<P><B>Notes: </B><OL COMPACT>
<LI>Turn off <TT><STRONG>Execute on Change</STRONG></TT> by selecting
<TT><STRONG>End Execution</STRONG></TT> in the
<TT><STRONG>Execute</STRONG></TT>
pull-down menu.
<LI>To restore the original view of the object, select
<TT><STRONG>Reset</STRONG></TT> in the
<TT><STRONG>View Control</STRONG></TT>
dialog box.
</OL>
<P>
<H5><U>Controlling the Field of View</U></H5>
<A NAME="IDX62"></A>
<A NAME="IDX63"></A>
<A NAME="IDX64"></A>
<P>
<TT><STRONG>Zoom</STRONG></TT> mode allows you to enlarge an object, making it
appear
closer (zooming in) or to reduce it, making it appear more distant
(zooming out).
<P>
<TT><STRONG>Pan/Zoom</STRONG></TT> mode allows you to change the center of
focus while zooming in or out.
<P>
<TT><STRONG>Zooming in&#58;</STRONG></TT>
<OL COMPACT>
<LI>Select <TT><STRONG>Zoom</STRONG></TT> in the <TT><STRONG>Mode</STRONG></TT>
option list of the dialog box.
<LI>To zoom in, position the mouse cursor in the Image window and
hold down the <I>left</I> mouse button.
An overlay rectangle appears.
<LI>You can enlarge or shrink this rectangle by moving the mouse
cursor away from or toward the center of the window.
<LI>When you release the mouse button, the area of the rectangle expands
to fill the Image window, making the object appear nearer.
<P><B>Note: </B>If you simply click the mouse button instead of holding it down,
the overlay rectangle will disappear before you can
change its dimensions.
The modified image of the object will be based on that rectangle.
(The size of the rectangle and thus the degree of "zoom" depends
on the distance of the cursor from the center of the window when
you first press the mouse button.)
<LI>To cancel the effect of the most recent command, select
<TT><STRONG>Undo</STRONG></TT> in the dialog box or in the
<TT><STRONG>Options</STRONG></TT> pull-down menu.
You can also repeat a command that has been "undone," by selecting
<TT><STRONG>Redo</STRONG></TT>.
<P><B>Note: </B>Since executed commands are maintained in a stack, you can undo
those commands one by one and redo them, too.
<LI><TT><STRONG>Reset</STRONG></TT> in the dialog box (or in the
<TT><STRONG>Options</STRONG></TT> pull-down) menu restores the
original <I>view:</I> (e.g., front) of the
object.
</OL>
<TT><STRONG>Zooming out&#58;</STRONG></TT>
<OL COMPACT>
<LI>Follow the procedure described for zooming in, but use the
<I>right</I> mouse button.
<LI>When you release the mouse button, the area of the Image window is
reduced to the area of the rectangle, making the object
appear more "distant".
</OL>
<TT><STRONG>Panning and Zooming out&#58;</STRONG></TT>
<OL>
<P><LI>Select <TT><STRONG>Pan/Zoom</STRONG></TT> in the
<TT><STRONG>Mode</STRONG></TT>
option list of the dialog box.
<P><LI>Position the mouse cursor at the point in the Image window that
you want as the center of the new "picture," and press the
appropriate mouse button (left to zoom in or right to
zoom out).
<P><LI>Move the mouse in any direction to display the overlay
rectangle.
The "zooming" behavior of the object with respect to the rectangle
will be the same as that just described.
<P><LI>To restore the original view of the object, select
<TT><STRONG>Reset</STRONG></TT> in the dialog box.
<P><LI>Leave the <TT><STRONG>View Control</STRONG></TT> dialog box open for the
next exercise.
</OL>
<P>
<H4><U>AutoAxes Configuration</U></H4>
<A NAME="IDX65"></A>
<A NAME="IDX66"></A>
<A NAME="IDX67"></A>
<P>
The <TT><STRONG>AutoAxes Configuration</STRONG></TT> dialog box allows you to
generate a set of axes for an object in the Image window and to
specify some of its characteristics.
<OL>
<P><LI>Click on <TT><STRONG>Options</STRONG></TT> in the menu bar of the Image
window and then select <TT><STRONG>AutoAxes</STRONG></TT> in the
pull-down menu.
The <TT><STRONG>AutoAxes Configuration</STRONG></TT> dialog box appears.
<P><B>Note: </B>To display additional options, click on the
<TT><STRONG>Expand</STRONG></TT> button at the
bottom of the dialog box.
For purposes of this tutorial, you will not be changing any
<TT><STRONG>AutoAxes</STRONG></TT> options.
For more information, see <A HREF="refgu014.htm#HDRAUTOAXE">AutoAxes</A> in
<I>IBM Visualization Data Explorer User&#39;s Reference</I>.
<P><LI>Click on the <TT><STRONG>Enabled</STRONG></TT> toggle button (at the top
of the dialog box) to select the AutoAxes option.
The button is now activated.
<P><LI>Click on <TT><STRONG>OK</STRONG></TT> or <TT><STRONG>Apply</STRONG></TT>
at
the bottom of the dialog box to confirm the selection.
<P><B>Notes: </B><OL COMPACT>
<LI><TT><STRONG>OK</STRONG></TT> closes the dialog box;
<TT><STRONG>Apply</STRONG></TT> does not.
<LI>Selection of <TT><STRONG>Enabled</STRONG></TT> and
<TT><STRONG>OK</STRONG></TT>
or <TT><STRONG>Apply</STRONG></TT> is necessary but not sufficient to
activate the AutoAxes option (see next step).
</OL>
<P><LI>Select <TT><STRONG>Execute</STRONG></TT> in the menu bar and then
<TT><STRONG>Execute Once</STRONG></TT> in the pull-down menu.
<P>
The object now appears in an axes box.
Because the view is "head on," the box appears to be
2-dimensional.
For <TT><STRONG>Diagonal</STRONG></TT> or any of the "Off" views,
however, it appears fully 3-dimensional (see next step).
<P><LI>To change the view of the object, select another (e.g.,
<TT><STRONG>Diagonal</STRONG></TT>) from the <TT><STRONG>Set View</STRONG></TT>
pull-down list in the <TT><STRONG>View Control...</STRONG></TT>
dialog box.
The view changes to <TT><STRONG>Diagonal</STRONG></TT> (note that the axes
box changes as well).
<P><LI>To remove the axes box from the window:
<OL>
<P><LI>Deactivate the <TT><STRONG>Enabled</STRONG></TT> toggle button in the
<TT><STRONG>AutoAxes Configuration</STRONG></TT> dialog box by
clicking on it.
<P><LI>Click on <TT><STRONG>OK</STRONG></TT> or <TT><STRONG>Apply</STRONG></TT>.
<P><LI>Again, execute the program (unless it is already in
<TT><STRONG>Execute on Change</STRONG></TT> mode).
The axes box disappears.
<P><LI>To restore the original view of the object, click on
<TT><STRONG>Reset</STRONG></TT> in the <TT><STRONG>View
Control</STRONG></TT> dialog box
</OL>
<P><LI>Close the <TT><STRONG>View Control</STRONG></TT> dialog box (by clicking
on <TT><STRONG>Close</STRONG></TT>) and the <TT><STRONG>AutoAxes
Configuration</STRONG></TT> dialog box (by clicking on
<TT><STRONG>Cancel</STRONG></TT>).
</OL>
<P><B><A NAME="FIGVCRCONT" HREF="../qikguide.htm#FT_FIGVCRCONT">Figure 7. Sequence
Control Panel</A></B>. The first two buttons at top left are Loop and
Palindrome. The others are: Step (&lt;<TT><STRONG>||</STRONG></TT>&gt;), Counter
(<TT><STRONG>...</STRONG></TT>), Back (&lt;), Forward (&gt;), Stop (&sqbul;),
and Pause (<TT><STRONG>||</STRONG></TT>).<BR>
<B><BR><CENTER><IMG SRC="../images/seqctrl.gif" ALT="Figure seqctrl not
displayed."></CENTER><BR></B><BR>
<P>
<H3><A NAME="HDRSEQUEN2" ></A>Using the Sequencer
</H3>
<A NAME="IDX68"></A>
<A NAME="IDX69"></A>
<P>
The Sequencer allows you to "animate" a visual image and is very
easy to use.
The process is rather like running a video cassette tape:
You can play it forward or backward, stop it, pause, and so on.
(If you look at the canvas of the VPE window, you will see that the
Sequencer is one of the components of the <TT>example1.net</TT>
network.)
<OL>
<P><LI>Click on <TT><STRONG>Execute</STRONG></TT> in the menu bar of the Image
window and then on <TT><STRONG>Sequencer</STRONG></TT> in the pull-down
menu to display the Sequence Control panel
(<A HREF="#FIGVCRCONT">Figure 7</A>).
<P><LI>Click on the Forward button (&gt;) to start the animation
sequence.
<P><B>Note: </B>A Sequencer button appears recessed when it is activated.
<P>
As the sequence proceeds, the Counter button
(<TT><STRONG>...</STRONG></TT>) displays the
corresponding "frame" number.
At the end of the execution cycle, the window displays the final image
in the sequence, the Counter displays the final frame
number, and the Forward button is
deactivated (not recessed).
<P><LI>Click on the Back button (&lt;) to run the same sequence
in reverse.
At the end of the execution cycle, the window displays the original
image, the Counter displays "0", and the Back
button is deactivated.
<P><LI>Click on the Step button (&lt;<TT><STRONG>||</STRONG></TT>&gt;) to
activate it.
You can now proceed through a sequence frame by frame in either
direction, using Back and Forward.
<P><B>Note: </B>In Step mode, the Back and Forward buttons appear as
&lt;<TT><STRONG>||</STRONG></TT> and <TT><STRONG>||</STRONG></TT>&gt;
respectively.
<P><LI>Click on Step again (to deactivate it) and then on the Loop button
at the top left (marked by a single "looped" arrow).
Now, if you click on Back or Forward, the sequence will repeat itself
until you interrupt it (see the next four steps).
<P><LI>Click on the Pause button (<TT><STRONG>||</STRONG></TT>) to suspend
the sequence.
<P><LI>Continue the sequence from this point or reverse it, using
Back or Forward.
<P><LI>Click on the Stop button (&sqbul;).
The sequence halts (the Loop button remains activated).
<P><B>Note: </B>The Stop button does not affect the status of the Loop,
Palindrome, or Step button.
<P><LI>Click on Back or Forward.
A new sequence starts again from the beginning (i.e., a "stopped"
sequence cannot be continued or reversed from the point at
which you interrupted it).
<P><LI>Click on Loop.
The sequence continues to its end before stopping and the Loop button
is deactivated (compare with the Stop button).
<P><LI>Click on the Palindrome button (between Loop and Step).
With this option activated, you can use the Back (or Forward) button to
run a sequence through one back-and-forth cycle (from first frame
to last and back to first, or vice versa).
Note that if you activate this function at some intermediate frame in
the sequence, only the <I>remainder</I> of the cycle
is executed.
<P><LI>To restore the original view of the object, click on
<TT><STRONG>Reset</STRONG></TT> in the <TT><STRONG>View
Control</STRONG></TT> dialog box.
<P><LI>Close the Sequence Control panel (double click on the window menu
button in top left corner of the frame).
</OL>
<TABLE BORDER WIDTH="100%"><TR><TH ALIGN="LEFT">For Future
Reference</TH><TR><TD>
<P>
You can activate both the Loop and Palindrome buttons together.
The back-and-forth cycle will repeat itself until you deactivate one
them or click on the Stop button.
</TD></TR></TABLE>
<P>
<H3><A NAME="HDRCPAPA" ></A>Using Control Panels</H3>
<A NAME="IDX70"></A>
<A NAME="IDX71"></A>
<P>
Control panels give you direct control of inputs to a
visual program.
The control panel included with <TT>example1&#46;net</TT>, for
example, allows you to incorporate a colored plane in the image
of an object and to decide the number of contour lines to be
displayed in that plane.
To open the control panel:
<OL>
<P><LI>Select <TT><STRONG>Windows</STRONG></TT> in the menu bar of the Image
window.
<P><LI>Select <TT><STRONG>Open All Control Panels</STRONG></TT> in the pull-down
menu.
The control panel appears (see <A HREF="#FIGCP1">Figure 8</A>).
</OL>
<P><B><A NAME="FIGCP1" HREF="../qikguide.htm#FT_FIGCP1">Figure 8. Control Panel
with two Interactors.</A></B>. &nbsp;<BR>
<B><BR><CENTER><IMG SRC="../images/ctrlpan.gif" ALT="Figure ctrlpan not
displayed."></CENTER><BR></B><BR>
<P>
To display a colored plane:
<OL>
<P><LI>Click on <TT><STRONG>off</STRONG></TT> in the Show MapToPlane
interactor.
<P><LI>Select <TT><STRONG>on</STRONG></TT> when it appears in the selection
list.
<P><LI>Select <TT><STRONG>Execute</STRONG></TT> in the menu bar of either the
control panel or the Image window.
<P><LI>Select <TT><STRONG>Execute on Change</STRONG></TT> in the
pull-down menu.
The visual program reexecutes and the colored plane is incorporated
as part of the current image.
<P><LI>To specify the number of contour lines, click on one of the two
stepper arrowheads in the <TT><STRONG>number of contour lines</STRONG></TT>
interactor (right to increase the number, left to
decrease it).
Since Data Explorer is in <TT><STRONG>Execute on Change</STRONG></TT> mode, the
number of contours changes when the number in the
interactor changes.
<P><B>Notes: </B><OL>
<P><LI>The second interactor has no effect if the <I>first</I>
interactor is <TT><STRONG>off</STRONG></TT>.
<P><LI>Depending on opacity and other factors, some of the contour
lines "inside" the object may not be visible.
</OL>
<P><LI>Click on <TT><STRONG>on</STRONG></TT> in the Show MapToPlane interactor
and then select <TT><STRONG>off</STRONG></TT> when
it appears.
The plane disappears and the original image is restored.
</OL>
<P>
<H3><A NAME="Header_33" ></A>Using the Colormap Editor
</H3>
<A NAME="IDX73"></A>
<A NAME="IDX74"></A>
<P>
The <TT>example1&#46;net</TT> visual program includes a Colormap
Editor for controlling the color characteristics of data values
represented in the visual image.
The editor also controls the <I>opacity</I> of those values
(see <A HREF="#TBLCOLMPED">Table 1</A>).
<P>
<H4><U>Opening the Colormap Editor:</U></H4>
<A NAME="IDX75"></A>
<OL>
<P><LI>Select <TT><STRONG>Open All Colormap Editors</STRONG></TT> in the
<TT><STRONG>Windows</STRONG></TT> pull-down menu of the
Image window.
Now changes made in the Colormap Editor (<A HREF="#FIGCMAPED">Figure 9</A>) will
be reflected both in the editor and in the image.
(Data Explorer should still be in <TT><STRONG>Execute on Change</STRONG></TT>
mode
from the preceding exercise.
If not, select that mode in any <TT><STRONG>Execute</STRONG></TT> pull-down
menu.)
For example:
<P><LI>Move the mouse cursor into the large rectangle under the
<TT><STRONG>Hue</STRONG></TT> label button (the cursor changes
from an arrow to a circle with sight marks).
<P><LI>Use the left mouse button to drag the <I>control point</I>
<A NAME="IDX76"></A>
(the small box in the upper left-hand corner of the rectangle)
horizontally to a position under <TT><STRONG>Hue</STRONG></TT>.
The color column to the left changes as the point moves.
<P><B>Note: </B>The <TT><STRONG>Hue</STRONG></TT> button is automatically
activated
when the mouse button is pressed with the cursor positioned
in the <TT><STRONG>Hue</STRONG></TT> rectangle.
<P><LI>Release the mouse button.
Color changes appear in the object.
<P><LI>Drag the control point back to its original position and release
the mouse button.
The color column and the object return to their original states.
</OL>
<BR>
<P><B><A NAME="TBLCOLMPED" HREF="qikgu002.htm#FT_TBLCOLMPED">Table 1. Image
Characteristics Controlled by the Colormap Editor</A></B><BR>
<TABLE BORDER>
<TR>
<TH ALIGN="LEFT" VALIGN="TOP" WIDTH="25%">Characteristic
</TH><TH ALIGN="LEFT" VALIGN="TOP"  WIDTH="25%">Description
</TH><TH ALIGN="LEFT" VALIGN="TOP"  WIDTH="50%">Numerical Range/
<BR>
Image Values
</TH></TR><TR>
<TD ALIGN="LEFT" VALIGN="TOP" WIDTH="25%">Hue
</TD><TD ALIGN="LEFT" VALIGN="TOP"  WIDTH="25%">A particular color
</TD><TD ALIGN="LEFT" VALIGN="TOP"  WIDTH="50%">0.000 = Red
<BR>
0.333 = Green
<BR>
0.666 = Blue
<BR>
1.000 = Red
</TD></TR><TR>
<TD ALIGN="LEFT" VALIGN="TOP" WIDTH="25%">Saturation
</TD><TD ALIGN="LEFT" VALIGN="TOP"  WIDTH="25%">Purity of color
</TD><TD ALIGN="LEFT" VALIGN="TOP"  WIDTH="50%">0.0 = White (all colors)
<BR>
0.5 = "Pastel" (50% of one color)
<BR>
1.0 = Pure (100% of one color)
</TD></TR><TR>
<TD ALIGN="LEFT" VALIGN="TOP" WIDTH="25%">Value
</TD><TD ALIGN="LEFT" VALIGN="TOP"  WIDTH="25%">Degree of brightness
</TD><TD ALIGN="LEFT" VALIGN="TOP"  WIDTH="50%">0.0 = Black (0% brightness)
<BR>
0.5 = Dark (50% brightness)
<BR>
1.0 = Maximum (100% brightness)
</TD></TR><TR>
<TD ALIGN="LEFT" VALIGN="TOP" WIDTH="25%">Opacity
</TD><TD ALIGN="LEFT" VALIGN="TOP"  WIDTH="25%">Degree of transparency
</TD><TD ALIGN="LEFT" VALIGN="TOP"  WIDTH="50%">0.0 = 0% Opaque (100%
transparent)
<BR>
0.5 = Semi-opaque (50% transparent)
<BR>
1.0 = 100% Opaque (0% transparent)
</TD></TR><TR>
<TD ALIGN="LEFT" VALIGN="TOP" COLSPAN="3">The numerical range used in specifying
discrete values of a
characteristic is 0.0-1.0.
Corresponding Colormap values at the limits and middle of a range are
also listed.
</TD></TR></TABLE>
<P>
Before going any further, you should familiarize yourself briefly with
the Colormap Editor (<A HREF="#FIGCMAPED">Figure 9</A>).
Note that the four labeled rectangles to the right correspond to the
characteristics listed in <A HREF="#TBLCOLMPED">Table 1</A>.
In each rectangle, at least two control points (very small "boxes")
and a line connecting them determine how the image characteristics
associated with a particular data value are represented in
the image (the figure shows the default settings).
<P>
Changes in the position of a control point are reflected directly in the
two left-hand columns of the editor and (in <TT><STRONG>Execute on
Change</STRONG></TT> mode) in the Image window.
The "data range" from the bottom to the top of the color column is
the
range of actual data values for which image characteristics
(e.g., hue) can be specified.
<P>
<H4><U>Specifying Colormap Values</U></H4>
<A NAME="IDX77"></A>
<A NAME="IDX78"></A>
<A NAME="IDX79"></A>
<A NAME="IDX80"></A>
<A NAME="IDX81"></A>
<P>
You can specify a Colormap value in two ways:
<UL>
<P><LI>Directly by manipulating a control point.
<P><LI>Indirectly through the <TT><STRONG>Add Control Points</STRONG></TT>
dialog box.
</UL>
The first is quick and approximate.
The second is slower and precise.
<P><B><A NAME="FIGCMAPED" HREF="../qikguide.htm#FT_FIGCMAPED">Figure 9. Colormap
Editor for .../example1.net</A></B>. The four image characteristics controlled
by the editor (hue, saturation, value, and opacity) are also listed in <A
HREF="#TBLCOLMPED">Table 1</A>. The numerical range for each is 0.0-1.0. For
<TT><STRONG>Hue</STRONG></TT> this range is "r g b r" (red green blue red); the
current setting corresponds to the red-green-blue spectrum of the color column
to the left. The column furthest left (RGB) displays the red-green-blue color
values corresponding to the four settings on the right. Note that each setting
is determined by a "line" whose position can be changed by moving the "control
point" at one of its ends; the shape of the line can be modified by adding
control points (see text). The values 0.0 and 2.5000000 are the minimum and
maximum of the data values used in the visual program.<BR>
<B><BR><CENTER><IMG SRC="../images/cmaped.gif" ALT="Figure cmaped not
displayed."></CENTER><BR></B><BR>
<A NAME="IDX82"></A>
<P>
<TT><STRONG>Specifying approximate values:</STRONG></TT>
<OL>
<P><LI>Position the mouse cursor in the middle of the large
<TT><STRONG>Value</STRONG></TT> rectangle and
<I>double click</I> the left
mouse button.
Note the changes that result:
<UL>
<P><LI>A new control point appears (turning the vertical line into two
line segments) and the <TT><STRONG>Value</STRONG></TT> button is
activated.
<P><LI>The data value of the new point is displayed in the data range next
to the color column (the RGB area, color column, and image show
corresponding changes).
</UL>
<P><LI>To move the control point, use the left mouse button to drag it.
The RGB area, color column, data value, and image all change
accordingly.
<P><LI>To return Value to its previous state, double click on the
control point.
</OL>
<TT><STRONG>Specifying exact values:</STRONG></TT>
<A NAME="IDX83"></A>
<OL>
<P><LI>Select <TT><STRONG>Edit</STRONG></TT> in the menu bar of the Colormap
Editor and then select <TT><STRONG>Add Control Points</STRONG></TT>
in the pull-down menu.
<A NAME="IDX84"></A>
A dialog box appears (see <A HREF="#FIGADDCON">Figure 10</A>).
<P><B><A NAME="FIGADDCON" HREF="../qikguide.htm#FT_FIGADDCON">Figure 10. Add
Control Points Dialog Box</A></B>. This dialog box has two interactors: The
first specifies the actual data value for which a corresponding set of Colormap
values are to be implemented. The second specifies one of the four Colormap
values, such as <TT><STRONG>Hue</STRONG></TT> in this example (see text).<BR>
<B><BR><CENTER><IMG SRC="../images/adctlpt.gif" ALT="Figure adctlpt not
displayed."></CENTER><BR></B><BR>
<A NAME="IDX85"></A>
<P><LI>Click on the <TT><STRONG>Saturation</STRONG></TT> rectangle of the
Colormap Editor.
The label button in the editor is activated (recessed) and the new
interactor label in the <TT><STRONG>Add Control Points</STRONG></TT>
dialog box changes to "Saturation value
(0.0 to 1.0)."
<P><LI>Click on the data value displayed in the dialog box, type in the
value <TT>1</TT>, and press
<TT><STRONG>Enter</STRONG></TT>.
The new value is displayed as <TT>1.00000</TT>.
<P><LI>Click on the saturation value displayed in the dialog box, type in
the value <TT><STRONG>.</STRONG>28</TT>, and press
<TT><STRONG>Enter</STRONG></TT>.
The new value is displayed as <TT>0.28000</TT>.
<P><LI>Click on <TT><STRONG>Add</STRONG></TT> in the dialog box:
A control point corresponding to the new values in the dialog box
appears in the <TT><STRONG>Saturation</STRONG></TT> rectangle of
the editor.
The RGB area, color column, and image all change accordingly.
</OL>
<P>
Now that you know how to open and execute visual programs and to
control the images they generate, you can proceed to
Tutorial II, which deals with various techniques
for visualizing data.
<TABLE BORDER WIDTH="100%"><TR><TH ALIGN="LEFT">Additional Notes on Control
Points</TH><TR><TD>
<A NAME="IDX86"></A>
<P>
<TT><STRONG>Displaying Control Point Values</STRONG></TT>
<P>
By default the Colormap Editor displays the values of all
control points.
To display the value of an individual point:
<OL COMPACT>
<LI>Select in order:
<OL COMPACT>
<LI><TT><STRONG>Options</STRONG></TT> in the menu bar of the ColorMap Editor
<LI><TT><STRONG>Display Control Point Data Value</STRONG></TT> in the
pull-down menu
<LI><TT><STRONG>Selected</STRONG></TT> in the pull-down list.
</OL>
<LI>Click on the desired control point in the ColorMap Editor (the
rectangle containing the control point is automatically
activated if it is not already activated).
The data value corresponding to the selected control point appears
in the data range next to the color column.
<LI>Repeat the preceding selection procedure, except click on
<TT><STRONG>All</STRONG></TT> in the pull-down list (instead of
<TT><STRONG>Selected</STRONG></TT>).
Data values for all control points in the <I>activated</I>
rectangle now appear in the data range.
</OL>
<P>
<TT><STRONG>Deleting Control Points</STRONG></TT>
<P>
You can delete control points one at a time or in groups:
<UL COMPACT>
<LI>To remove control points one at a time (in an activated rectangle),
<I>double click</I> on each point to be removed
<LI>To remove two or more points at a time:
<OL COMPACT>
<LI>Select points by either:
<UL COMPACT>
<LI>Shift-clicking: Press the Shift key and click on each point to be
deleted; <I>or</I>
<LI>Drawing a selection box: Hold down the left mouse button and drag
the cursor to generate a "selection box" in the selected
rectangle and enlarge it to the desired size.
Release the button (the box disappears, but any "boxed" points
are selected).
</UL>
<LI>Select <TT><STRONG>Edit</STRONG></TT> in the menu bar and then
<TT><STRONG>Delete Selected Control Points</STRONG></TT> in the
pull-down menu.
All selected control points are deleted and the image is updated.
</OL>
</UL>
</TD></TR></TABLE>
		<P>
		<HR>
		<DIV align="center">
			<P><A href="../allguide.htm"><IMG src="../images/foot-fc.gif" width="94" height="18" border="0" alt="Full Contents"></A> <A href="../qikguide.htm"><IMG src="../images/foot-qs.gif" width="94" height="18" border="0" alt="QuickStart Guide"></A> <A href="../usrguide.htm"><IMG src="../images/foot-ug.gif" width="94" height="18" border="0" alt="User's Guide"></A> <A href="../refguide.htm"><IMG src="../images/foot-ur.gif" width="94" height="18" border="0" alt="User's Reference"></A></P>
		</DIV>
		<DIV align="center">
			<P><FONT size="-1">[ <A href="http://www.research.ibm.com/dx">OpenDX Home at IBM</A>&nbsp;|&nbsp;<A href="http://www.opendx.org/">OpenDX.org</A>&nbsp;] </FONT></P>
			<P></P>
		</DIV>
		<P></P>
	</BODY></HTML>
